<template>
  <div >
    <div>
      <div class="font15 mt10 pl10">
        <span class="titletext ">{{titledata.title}}</span>
        <div class="graytext  mt10 font13">
          <span >工单编号：</span>
          <span class="titletext">{{titledata.pmInsId}}</span>
        </div>
      </div>
      <section-header sectionTitle="商机研判表单-商机信息"></section-header>
      <van-field readonly required name="city" :value="fromdata.city" label="地市:" label-width="3em" />
      <van-field readonly required name="county" :value="fromdata.county" label="县区:" label-width="3em" />
      <van-field readonly required name="customerCode" :value="fromdata.customerCode" label="集团客户编码:" label-width="7em" />
      <van-field readonly required name="customerName" :value="fromdata.customerName" label="集团客户名称:" label-width="7em" />
      <van-field readonly required name="businessId" :value="fromdata.businessId" label="商机编码:" label-width="5em" />
      <van-field readonly required name="businessName" :value="fromdata.businessName" label="商机名称:" label-width="5em" />
      <van-field readonly required name="businessStatus" :value="fromdata.businessStatus" label="商机状态:" label-width="5em" />
      <van-field readonly required name="createDate" :value="fromdata.createDate" label="录入时间:" label-width="5em" />
      <van-field readonly required name="mgrName" :value="fromdata.mgrName" label="客户经理姓名:" label-width="7em" />
      <van-field readonly required name="preAmountY" :value="fromdata.preAmountY" label="预估金额(元):" label-width="7em" />
      <van-field readonly required name="industryType" :value="fromdata.industryType" label="行业类型(线索):" label-width="8em" />
      <van-field readonly required name="businessIndustryType" :value="fromdata.businessIndustryType" label="客户行业(商机):" label-width="8em" />
      <van-field readonly required name="businessGrade" :value="fromdata.businessGrade" label="集团商机分级:" label-width="7em" />
      <van-field readonly required name="provinceBusinessGrade" :value="fromdata.provinceBusinessGrade" label="省内商机分级:" label-width="7em" />
      <van-field readonly required name="businessType" :value="fromdata.businessType" label="业务类型:" label-width="5em" />
      <van-field readonly required name="implementationPlan" :value="fromdata.implementationPlan" label="项目实施方案:" label-width="7em" />
      <van-field readonly required name="involvedProducts" :value="fromdata.involvedProducts" label="涉及具体产品类目:" label-width="9em" />
      <van-field readonly required name="involvedSolutions" :value="fromdata.involvedSolutions" label="涉及具体解决方案:" label-width="9em" />
      <van-field readonly required name="fivegSubdivisions" :value="fromdata.fivegSubdivisions" label="涉及具体5G细分行业:" label-width="10em" />
      <van-field readonly required name="isSpecialDebt" :value="fromdata.isSpecialDebt" label="是否专项债:" label-width="6em" />
      <van-field autosize  type="textarea"  rows='1' readonly required name="projectDesc" :value="fromdata.projectDesc" label="商机简介(建设内容):" label-width="10em" />
      <section-header sectionTitle="产品预估金额"></section-header>
        <el-table :data="fromdata.estimatedBusinessAmountList" show-summary>
          <el-table-column prop="businessOppCategory" label="产品名称"/>
          <el-table-column prop="estBusinessAmount" label="产品预估金额(万元)"/>
        </el-table>
      <section-header sectionTitle="商机研判表单-建设信息"></section-header>
      <div>
        <van-field readonly name="businessDemandFile" label="商机需求文件:" label-width="7em" center>
          <template #button  v-if="isdrawType||isStart">
            <van-uploader :after-read="file2server">
              <van-button size="small" type="primary" color="#0f85cf">上传附件</van-button>
            </van-uploader>
          </template>
        </van-field>
        <div v-for="(fileitem, index2) in fromdata.businessDemandFile" :key="fileitem.id"
             style="margin-left: 20px">
          <div readonly class="font14 fileLink" style="color: #0f85cf">
            <a target="_blank" @click="openFileUrlfun(fileitem.anonymousFilePath)">{{ fileitem.fileName }}</a>
          </div>
          <van-icon name="close" color="#ea0023" size="20" v-if="isdrawType||isStart"
                    @click="deleteFile(index2)" />
        </div>
      </div>

      <historyAndSuggs id='target' :showHistory='showHistory'
            :historydata='historydata' :approveList='approveList' :isdrawType='isdrawType'/>
    </div>
    
   
  </div>
</template>
 
<script>
import { openFileUrl } from '@/store/openFile'
import historyAndSuggs from "@/views/srqr/historyAndSuggs.vue"
import SectionHeader from '../sztdzj/sztdzjDetail/section-header.vue';
import {uploadFileCommon} from "@/api/dictapi";
export default {
  data() {
    return {
      sjlistdata:{}
    }
  },
  props: ['canEdit','titledata','businessdata','fromdata','showHistory','historydata','approveList','isdrawType','isStart'],
  watch: {
    fromdata: {
      handler () { //这是vue的规定写法，当你watch的值发生变化的时候，就会触发这个handler，这是vue内部帮你做的事情
        console.log('子页面数据发生变化')
        this.$emit('freshData',this.fromdata)
      },
      deep: true,  // 可以深度检测到 obj 对象的属性值的变化
      immediate: true //刷新加载  立马触发一次handler
    },
  }, 
  activated(){

  },
  methods: {
     tomsg () {
      document.getElementById('target').scrollIntoView({ behavior: 'smooth' })
    },
    openFileUrlfun(value) {
      this.$router.push(
        {
          name: 'fileview',
          query: {
            openFileUrl: openFileUrl(value)
          }
        }
      );
    },
    deleteFile(index) {
      Dialog.confirm({ title: "提示", message: "是否删除此附件？" })
          .then(() => {
            this.fromdata.handleFile.splice(index, 1);
          })
          .catch(() => { });
    },
    file2server(file) {
      let fileData = new FormData();
      fileData.append("pmInsType", this.pmInsType);
      fileData.append("pmInsTypePart", "1");
      fileData.append("files", file.file);

      let params = new Map();
      params.pmInsType = this.pmInsType;
      params.pmInsTypePart = '1';
      params.userName = this.user.userName;
      uploadFileCommon(fileData, params).then((res) => {
        if (!res.data) {
          Notify(res.message);
          return;
        }
        if (res.data.data) {
          if (this.fromdata.makingOpinionsFileList === null) {
            this.fromdata.makingOpinionsFileList = [];
          }
          this.fromdata.makingOpinionsFileList.push(res.data.data.sysFiles[0]);
        }
      });
    }
  },
  components: {
    historyAndSuggs,
    SectionHeader
  },
}
</script>
 
<style>
.tables.el-table .cell {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-break: break-all;
    line-height: 15px;
    padding-left: 5px;
    padding-right: 5px;
}
</style>